<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="../../../assets/common/common.css" />
    <link rel="stylesheet" href="../../../assets/iconfont/iconfont.css" />
    <link rel="stylesheet" href="./PayslipDetails.css" />
  </head>
  <body>
    <div class="PayslipDetails">
      <!-- 工资表详情 -->
      <header class="top w100 bg-fff flex aic pl-10 pr-10 jc-sb">
        <a href="../Payslip.html">
          <span class="iconfont icon-xiangzuojiantou"></span>
        </a>
        <span>2022年01月工资表</span>
        <span class="fix"></span>
      </header>
      <!-- 个人信息 -->
      <div class="information bg-fff flex aic pl-20 pr-20 w100 jc-sb f12">
        <img src="../../../assets/img/__80px_u3817.png" alt="" />
        <div class="fdc fg1">
          <span class="f16">吴珊珊</span>
          <span class="mt-10 font1">薪资组：销售一组</span>
        </div>
        <span class="font">待确认</span>
      </div>

      <!-- 提示信息 -->
      <div class="tips ml-20 mr-20 mt-10 flex aic pl-10">
        <img src="../../../assets/img/error_outline_u5297.png" alt="" />
        <span class="ml-10 f14">工资条属于铭感信息，请注意保密哦</span>
      </div>
      <!-- 薪资明细 -->
      <div class="font2 bg-fff pl-10">薪资明细</div>
      <ul class="detailsList f14 fdc bg-fff pl-10">
        <li class="item flex">
          <span class="details">基本薪资</span>
          <span>&yen;8000.00</span>
        </li>
        <li class="item flex">
          <span class="details">事假</span>
          <span>2.0天</span>
        </li>

        <li class="item flex">
          <span class="details">事假扣款</span>
          <span>&yen;800.00</span>
        </li>

        <li class="item flex">
          <span class="details">加班时长</span>
          <span>2.0h</span>
        </li>

        <li class="item flex">
          <span class="details">加班工资</span>
          <span>&yen;200.00</span>
        </li>

        <li class="item flex">
          <span class="details">个税</span>
          <span>&yen;200.00</span>
        </li>

        <li class="item flex">
          <span class="details">社保</span>
          <span>&yen;300.00</span>
        </li>
        <li class="item flex">
          <span class="details">实发工资</span>
          <span class="totalmoney">&yen;6900.00</span>
        </li>
      </ul>
      <!-- 自动确认 -->
      <div class="text mt-10 pl-10 f12 mb-30">系统将于23小时08分后自动确认</div>
      <!-- 底部 -->
      <div class="footer fixed bg-fff flex fcc">
        <div class="text1 tac">确认工资</div>
      </div>
    </div>
  </body>
</html>
